<template>
  <view
    :style="{ top: safeArea.top + 'px' }"
    class="back icon-left"
    @click="onBack"
  />
</template>

<script setup>
import { useSystemStore } from "@/store";
const safeArea = useSystemStore().safeArea;
const onBack = () => {
  const pages = getCurrentPages();
  if (pages.length > 1) {
    uni.navigateBack();
  } else {
    uni.switchTab({ url: "/pages/index/index" });
  }
};
</script>

<style>
.back {
  position: absolute;
  left: 50rpx;
  z-index: 9;

  display: flex;
  justify-content: center;
  align-items: center;
  width: 60rpx;
  height: 60rpx;
  border-radius: 50%;
  font-size: 23px;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.5);
}
</style>